import React, { FC, useState, ChangeEvent } from "react";
import { useDispatch } from "react-redux";
import { itemType } from "../../store/todoList";
import { addItemList, deleteList, completedList } from "../../store/todoList";
const Frominput: FC = () => {
  const [id, setid] = useState("");
  const [name, setname] = useState("");
  const dispatch = useDispatch();
  const idhandle = (e: ChangeEvent<HTMLInputElement>) => {
    setid(e.target.value);
  };

  const namehandle = (e: ChangeEvent<HTMLInputElement>) => {
    setname(e.target.value);
  };

  const handlesubmit = () => {
    const obj: itemType = {
      id,
      name,
      isCompleted: false,
    };
    dispatch(addItemList(obj));
    console.log(obj);
  };
  return (
    <>
      <label htmlFor="id"></label>
      <input type="text" id="id" value={id} onChange={idhandle} />
      <label htmlFor="name"></label>
      <input type="text" id="name" value={name} onChange={namehandle} />
      <button onClick={handlesubmit}>添加提交</button>
    </>
  );
};

export default Frominput;
